<template>
  <!--虚拟出库状态-->
  <div class="depot_status">
  <span class="block_label_color mad_label"
        :class="stateColor">{{data.statusLabel}}</span>
  </div>
</template>

<script>
export default {
  name: 'DepotStatus',
  props: {
    data: Object
  },
  computed: {
    stateColor() {
      switch (this.data.statusValue) {
        case 'Success':
          return 'depot_status_success'
        case 'Fail':
          return 'depot_status_fail'
      }
    }
  }
}
</script>

<style scoped lang="less">
  // 已出库
  @DepotStatusSuccess: #7e8e9f;
  // 出库失败
  @DepotStatusFail: #f8000f;
  .depot_status {
    .block_label_color {
      &.depot_status_success {
        background-color: @DepotStatusSuccess;
      }

      &.depot_status_fail {
        background-color: @DepotStatusFail;
      }
    }
  }
</style>
